<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>成为VIP</title>
    <link rel="stylesheet" href="../css/base.min.css">
    <link rel=stylesheet href="../css/become-vip.min.css">
</head>
<body>
<!-- container -->
<div class="container ">
    <!--vip嘉年华-->
    <div class="vip clearfix">
        <img src="../img/y-vipTopBg.png" alt="">
        <div class="banxin">
            <h1>VIP特权嘉年华</h1>
            <div class="vip-bottom clearfix">
                <div>
                    <img src="../img/y-vipTop.png" alt="">
                    <p>开通会员</p>
                    <p>无限次使用会员服务</p>
                    <p>¥999</p>
                </div>
                <div class='vip-right clearfix'>
                    <h1>第一志愿VIP</h1>
                    <ul style="margin-right: 109px;">
                        <li style="color: #fe6a23;font-size: 20px;">功能特权:</li>
                        <li><span></span>院校历年专业录取详细数据</li>
                        <li><span></span>一键智能填报并生成志愿表</li>
                        <li><span></span>独家就业数据智能分析</li>
                    </ul>
                    <ul>
                        <li style="color:#11bdc5;font-size: 20px;">使用说明:</li>
                        <li><span></span>适用考生：全日制统招生及特长生</li>
                        <li><span></span>适用批次：普通类非提前批</li>
                        <li><span></span>会员有效期：<i>1年</i></li>
                    </ul>
                </div>
                <div class="vip-last">
                    <a href="javascript:void(0)" class="rightNowKT reveal">立即开通</a>
                    <a href="javascript:void(0)" style="margin-left:104px;background-color:#11bdc5;" class="rightNowJH reveal">立即激活</a>
                </div>
            </div>
        </div>
    </div>
    <!--五大专属特权-->
    <div class="exclusive">
        <h1>专属五大特权</h1>
        <!--<img src="../img/y-zhuanshu.png" alt="">-->
        <div class="boxs">
            <div class="banxin">
                <div class="reveal skip">
                    <a href="javascript:void(0)">
                        <p style="color:#ffba7e">测试录取率</p>
                        <img src="" alt="">
                    </a>
                </div>
                <div style="bottom: 0; left:226px;" class="reveal skip">
                    <a href="javascript:void(0)">
                        <p style="color:#7f9ce7">成绩分析报告</p>
                        <img src="" alt="">
                    </a>
                </div>
                <div style="top: 0; left:452px;" class="skip">
                    <a href="">
                        <p style="color:#49d6dc">看就业选学校</p>
                        <img src="" alt="">
                    </a>
                </div>
                <div style="bottom: 0; left:681px;" class="skip">
                    <a href="">
                        <p style="color:#ffd57e">看就业选专业</p>
                        <img src="" alt="">
                    </a>
                </div>
                <div style="top: 0; right:0px;" class="skip">
                    <a href="">
                        <p style="color:#ffc6ab">按职业选专业</p>
                        <img src="" alt="">
                    </a>
                </div>
            </div>
        </div>
    </div>
    <!--直击四大痛点-->
    <div class="pain banxin clearfix">
        <h1>直击4大痛点</h1>
        <div style="background-image: url(../img/y-tong1.png);">
            <span>1</span>
            <p>我的分数可以</p>
            <p>上什么学校？</p>
        </div>
        <div style="background-image: url(../img/y-tong2.png);">
            <span>2</span>
            <p>我的分数可以</p>
            <p>读哪些专业？</p>
        </div>
        <div style="background-image: url(../img/y-tong3.png);">
            <span>3</span>
            <p>我就读xx大学</p>
            <p>的概率高吗？</p>
        </div>
        <div style="background-image: url(../img/y-tong4.png);">
            <span>4</span>
            <p>我对填报的院校</p>
            <p>和专业一头雾水？</p>
        </div>
    </div>
    <!--全面分析志愿填报需求-->
    <div class="require">
        <h3>全面分析志愿填报需求</h3>
        <div class="reBox">
            <img src="../img/y-bajiao.png" alt="">
            <div class="jiaoL" style="top:-70px; left: 142px;">
                <h1>填报建议</h1>
                <p>给出详细填报建议</p>
            </div>
            <div class="jiaoL" style="top:70px; left: 34px;">
                <h1>填报政策</h1>
                <p>深度解读最新政策</p>
            </div>
            <div class="jiaoL" style="bottom:154px; left: 25px;">
                <h1>成绩分析</h1>
                <p>给出适合分析报告</p>
            </div>
            <div class="jiaoL" style="bottom:3px; left: 142px;">
                <h1>就业专业</h1>
                <p>先看就业再选专业</p>
            </div>

            <div class="jiaoR" style="top:-70px; right: 142px;">
                <h1>毕业薪酬</h1>
                <p>披露毕业薪酬报告</p>
            </div>
            <div class="jiaoR" style="top:70px; right: 34px;">
                <h1>录取预测</h1>
                <p>精准预测录取概率</p>
            </div>
            <div class="jiaoR" style="bottom:154px; right: 25px;">
                <h1>批次线</h1>
                <p>历年文理科批次线</p>
            </div>
            <div class="jiaoR" style="bottom:3px; right: 136px;">
                <h1>兴趣筛选</h1>
                <p>按自己意愿选学校</p>
            </div>
        </div>
    </div>
    <!--第一志愿VIP-->
    <div class="purchase clearfix">
        <img src="../img/y-vipBG.png" alt="">
        <div>
            <h1>第一志愿VIP</h1>
            <h1>¥999</h1>
            <a href="javascript:void(0)" class="reveal">立即开通</a>
        </div>
    </div>
</div>
<div class="y-opacity display-none">
    <!--激活VIP-->
    <div class="becomeVIP display-none">
        <div class="clearfix closeA">
            <a href="javascript:void(0)">×</a>
        </div>
        <h3>第一志愿VIP购买</h3>
        <form class="pay">
            <div class="clearfix bosLIS">
                <span>第一志愿VIP：</span>
                <div>专属VIP：¥999</div>
            </div>
            <div class="clearfix bosLIS">
                <span>实付金额：</span>
                <i>￥999</i>
            </div>
            <div class="clearfix bosLIS">
                <span>支付方式：</span>
                <input type="radio">
                <img src="" alt="">支付宝支付
            </div>
            <a href="">立即购买</a>
        </form>
    </div>
    <!--开通VIP-->
    <div class="startVIP display-none">
        <div class="clearfix closeA">
            <a href="javascript:void(0)">×</a>
        </div>
        <h3>第一志愿VIP激活</h3>
        <form action="">
            <div class="bosLIS clearfix">
                <span>激活码:</span>
                <input type="text" placeholder="请输入激活码">
            </div>
            <a href="">立即激活</a>
        </form>
    </div>
</div>
<!--模态框-->
<div class="tips" id="tips" style="display: none;">
	<div class="tips-secondary">
		<div class="return conceal" id="tips-close">x</div>
		<div class="prompt"><span>!</span>温馨提示</div>
		<div class="prompt-substance">网页版暂不支持该功能，请用手机下载第一志愿APP使用该功能。</div>
		<ul class="clearfix"  id="tips-options">
			<li class="no-download conceal">暂不下载</li>
			<li class="download"><a href="../view/special.html">下载APP使用</a></li>
		</ul>
	</div>
</div>
<script type="text/javascript" src="../js/vue.min.js"></script>
<script src="../js/jquery-1.11.1.min.js"></script>
<script src="../js/img.js"></script>
<script src="../js/base_back.js"></script>
<script src="../js/become-vip.js"></script>
</body>
</html>